import React from 'react';
import {Radio} from 'antd';
const RadioGroup = Radio.Group;
import {WeaSearchGroup, WeaFormItem, WeaSelect} from 'ecCom';
import {WeaLocaleProvider} from 'ecCom';
const getLabel = WeaLocaleProvider.getLabel;
import EType from './base/EType';
import ETitle from './base/ETitle';
import ELinkMode from './base/ELinkMode';

// 自定义菜单
export default class Content_menu extends React.Component {
    state = {
        eMenuFrom: this.props.eMenuFrom.selected,
        eMenuStyleType: this.props.eMenuStyleType,
        eMenuHStyle: this.props.eMenuHStyle.selected,
        eMenuVStyle: this.props.eMenuVStyle.selected,
    };

    render() {
        const {eMenuFrom, eMenuStyleType, eMenuHStyle, eMenuVStyle} = this.state;

        let EMenuFrom = <div></div>;
        let EMenuStyle = <div></div>;
        if (this.props.eShareLevel == '2') {
            EMenuFrom = (
                <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@zpe2k4`} label={getLabel(18773, '自定义菜单')} labelCol={{span: 6}} wrapperCol={{span: 16}}>
                    <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@thx1nq`}
                        options={
                            this.props.eMenuFrom.options.map((item) => {
                                return {key: item.key, selected: false, showname: item.value};
                            })
                        }
                        value={eMenuFrom}
                        style={{width: '200px'}}
                        onChange={value => {
                            this.setState({eMenuFrom: value});
                        }}
                    />
                </WeaFormItem>
            );

            EMenuStyle = (
                <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@n5lb8u`} label={getLabel(22916, '菜单样式')} labelCol={{span: 6}} wrapperCol={{span: 16}}>
                    <RadioGroup ecId={`${this && this.props && this.props.ecId || ''}_RadioGroup@j9uqk5`} value={eMenuStyleType} onChange={e => this.setState({eMenuStyleType: e.target.value})}>
                        <Radio ecId={`${this && this.props && this.props.ecId || ''}_Radio@skjifd`} value="menuh">{getLabel(386591, '横向样式（仅支持一级菜单）')}</Radio>
                        <Radio ecId={`${this && this.props && this.props.ecId || ''}_Radio@byjl9b`} value="menuv">{getLabel(386592, '纵向样式（仅支持二级菜单）')}</Radio>
                    </RadioGroup>
                    {
                        eMenuStyleType == 'menuh' ?
                            <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@0f9e03`}
                                options={
                                    this.props.eMenuHStyle.options.map((item) => {
                                        return {key: item.key, selected: false, showname: item.value};
                                    })
                                }
                                value={eMenuHStyle}
                                style={{width: '200px'}}
                                onChange={value => {
                                    this.setState({eMenuHStyle: value});
                                }}
                            /> :
                            <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@ja25cd`}
                                options={
                                    this.props.eMenuVStyle.options.map((item) => {
                                        return {key: item.key, selected: false, showname: item.value};
                                    })
                                }
                                value={eMenuVStyle}
                                style={{width: '200px'}}
                                onChange={value => {
                                    this.setState({eMenuVStyle: value});
                                }}
                            />
                    }
                </WeaFormItem>
            );
        }

        return (
            <div>
                <WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@gceebf`} title={getLabel(81711, '基本信息')} needTigger={true} showGroup={true}>
                    <EType ecId={`${this && this.props && this.props.ecId || ''}_EType@lkasvk`} ref="eType" value={this.props.eBaseName}/>
                    {this.props.eShareLevel == '2' ? <ETitle ecId={`${this && this.props && this.props.ecId || ''}_ETitle@ggv7rr`} ref="eTitle" eid={this.props.eid} value={this.props.eTitle} {...this.props}/> : ''}
                    {/*<ELinkMode ref="eLinkMode" options={this.props.eLinkMode.options} value={this.props.eLinkMode.selected}/>*/}
                    {EMenuFrom}
                    {EMenuStyle}
                </WeaSearchGroup>
            </div>
        );
    }

    getSaveValues() {
        return {
            eContentTitle: this.refs['eTitle'] ? this.refs['eTitle'].getSaveValues() : this.props.eTitle,
            // eContentLinkMode: this.refs['eLinkMode'].getSaveValues(),
            eContentMenuFrom: this.state.eMenuFrom,
            eContentMenuStyleType: this.state.eMenuStyleType,
            eContentMenuHStyle: this.state.eMenuHStyle,
            eContentMenuVStyle: this.state.eMenuVStyle
        };
    }
}